<!DOCTYPE html>
<html lang="ja" xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta charset="UTF-8" />
    <meta name="author" content="SENOO, Ken" />
    <title>MaMiShare</title>
  </head>
  <body>
    <main>
<fieldset>
  <style>
  /* @scope { */
    fieldset input, fieldset a {
      width: 100%;
      color: white;
      font-size: 2em;
      text-align: center;
    }
    fieldset div {
      display: flex;
    }
  /* } */
  </style>
  <legend>Share</legend>
  <div>
    <a style="background-color:#333"
      onclick="navigator.clipboard.writeText(
        document.title+' '+location.href);">Copy</a>
    <a style="background-color:#2c6ebd"
      href="https://b.hatena.ne.jp/entry/s/"
      onmousedown="this.href='https://b.hatena.ne.jp/entry/s/'
        +location.host+'/'+location.pathname">Hatena</a>
    <a style="background-color:#3b5998"
      href="https://www.facebook.com/sharer/sharer.php?t="
      onmousedown="this.href='https://www.facebook.com/sharer/sharer.php?t='
        +encodeURIComponent('QP '+document.title)
        +'&u='+encodeURIComponent(location.href);">Facebook</a>
    <a style="background-color:#1da1f2"
      href="https://twitter.com/intent/tweet?text="
      onmousedown="this.href='https://twitter.com/intent/tweet?text='
        +encodeURIComponent('QP '+document.title)
        +'&url='+encodeURIComponent(location.href);">X/Twitter</a>
    <a style="background-color:black"
      href="https://www.threads.net/intent/post?text="
      onmousedown="this.href='https://www.threads.net/intent/post?text='
        +encodeURIComponent('QP '
        +document.title+' '+location.href);">Threads</a>
  </div>
  <div>
    <input id="MaMiShare.host" list="MaMiList" type="email" inputmode="email"
      autocomplete="on" autocorrect="off" autocapitalize="off"
      formnovalidate='formnovaildate' placeholder="mstdn.jp misskey.io"
      style="background-color:rgb(158,194,63)" />
    <a style="background-color:rgb(99,100,255);"
      href="https://mamishare.jp"
      onmousedown="localStorage.setItem('MaMiShare.host',
        this.previousElementSibling.value);
        this.href=`https://${this.previousElementSibling.value}/share?text=QP `
          +encodeURIComponent(document.title+' '+location.href);
      ">MaMiShare</a>
    <script>
      window.addEventListener('load', () => {
        document.getElementById('MaMiShare.host').value =
          localStorage.getItem('MaMiShare.host');
      });
    </script>
    <datalist id="MaMiList">
      <option value="fedibird.com"></option>
      <option value="gp.tsukimi.club"></option>
      <option value="mastodon.social"></option>
      <option value="mattyaski.co"></option>
      <option value="meisskey.one"></option>
      <option value="misskey-square.net"></option>
      <option value="misskey.04.si"></option>
      <option value="misskey.backspace.fm"></option>
      <option value="misskey.cloud"></option>
      <option value="misskey.gg"></option>
      <option value="misskey.io"></option>
      <option value="misskey.niri.la"></option>
      <option value="misskey.one"></option>
      <option value="misskey.secinet.jp"></option>
      <option value="misskey.systems"></option>
      <option value="mk2.toyoko.in"></option>
      <option value="msk.ilnk.info"></option>
      <option value="mstdn.jp"></option>
      <option value="nijimiss.moe"></option>
      <option value="novelskey.tarbin.net"></option>
      <option value="pawoo.net"></option>
      <option value="submarin.online"></option>
      <option value="sushi.ski"></option>
    </datalist>
  </div>
</fieldset>
<fieldset>
  <legend>Follow</legend>
  <div>
    <a style="background-color:#f26522"
      href="https://web.gnusocial.jp/feed">
      RSS</a>
    <a style="background-color:#2bb24c"
      href="https://feedly.com/i/discover/sources/search/feed/https%3A%2F%2Fweb.gnusocial.jp">
      Feedly</a>
    <a style="background-color:#3b5998"
      href="https://www.facebook.com/profile.php?id=61556435340202">
      Facebook</a>
    <a style="background-color:#1da1f2"
      href="https://x.com/gnusocialjp">X/Twitter</a>
  </div>
  <div>
    <a style="background-color:black"
      href="https://www.threads.net/@gnusocialjp">
      Threads</a>
    <a style="background-color:rgb(0,112,255)"
      href="https://bsky.app/profile/did:plc:cgtlyuedd3qwmtycjv62xhma">
      Bluesky</a>
    <a style="background-color:#a22430"
      href="https://gnusocial.jp/gnusocialjp">
      GNU social</a>
  </div>
</fieldset>
    </main>
  </body>
</html>

